<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="css/reset.css" />
		<link rel="stylesheet" href="css/common.css" />
		<link rel="stylesheet" href="css/index.css" />
		<link rel="stylesheet" href="css/swiper-4.3.3.min.css" />
	</head>

	<body>
		<div class="web">
			<header>
				<div>
					<div class="hTop clear_fix">
						<div class="le fl">
							<span>全国服务热线：400-000-0000</span>
						</div>
						<div class="ri fr">
							<span><a href="#">设为首页</a></span>
							<span><a href="#">加入收藏</a></span>
						</div>
					</div>
				</div>
				<div>
					<div>
						<div class="logoP clear_fix">
							<div class="fl"><img src="img/logo1.png" /> </div>
							<div class="logoW fl">
								<span>TK科技有限公司</span>
								<p>cer dcd keo Holdings Co., Ltd.</p>
							</div>
						</div>

						<ul class="navS clear_fix">
							<li>
								<a href="index.html">
									<p>首页</p>
									<p>Home</p>
								</a>
							</li>
							<li>
								<a href="detailed.html">
									<p>关于我们</p>
									<p>About</p>
								</a>
							</li>
							<li>
								<a href="product.html">
									<p>产品中心</p>
									<p>Products</p>
								</a>
							</li>
							<li>
								<p>服务支持</p>
								<p>Service</p>
							</li>
							<li>
								<p>新闻中心</p>
								<p>News</p>
							</li>
							<li>
								<p>在线商城</p>
								<p>Shop</p>
							</li>
							<li>
								<p>联系我们</p>
								<p>Contact Us</p>
							</li>
						</ul>
					</div>
				</div>
			</header>

			<section>
				<div class="swiper-container">
					<div class="swiper-wrapper">
						<div class="swiper-slide"><img src="img/banner1.jpg" /></div>
						<div class="swiper-slide"><img src="img/banner1.jpg" /></div>
						<div class="swiper-slide"><img src="img/banner1.jpg" /></div>
						<div class="swiper-slide"><img src="img/banner1.jpg" /></div>
					</div>
					<!-- Add Pagination -->
					<div class="swiper-pagination"></div>
				</div>
				<div class="show-box">
					<ul>
						<li>
							<div class="blue-box">
								<img src="img/new-center.png" />
								<p>新闻中心</p>
								<p>NEWS.CENTER</p>
								<i class="squareB"></i>
							</div>
							<div class="details clear_fix">
								<div class="fl">
									<p>CeBIT 2015</p>
									<img src="img/pic1.jpg" alt="" />
								</div>
								<div class="fl">
									<p>创新ICT共建全联接<br /> 世界德国汉诺威展览
										<br /> 中心
										<br /> 3月16日-20日
									</p>
								</div>
							</div>
							<ul class="news-list">
								<li><span>上海国际智能建筑展览会</span></li>
								<li><span>2014德国柏林国际消费类电子产品展览会</span></li>
								<li><span>2014中国（贵阳）公告安全防范产品博览会</span></li>
							</ul>
						</li>
						<li class="clear_fix">
							<div class="green-box">
								<img src="img/new-product.png" />
								<p>新品发布</p>
								<p> NEW.PRODUCTS</p>
								<i class="squareG"></i>
							</div>
							<div class="detailsG clear_fix">
								<div class="swiper-container">
									<div class="swiper-wrapper">
										<div class="swiper-slide"><img src="img/product1.jpg" /></div>
										<div class="swiper-slide"><img src="img/product1.jpg" /></div>
										<div class="swiper-slide"><img src="img/product1.jpg" /></div>
									</div>
									<!-- Add Arrows -->
									<div class="swiper-button-next"></div>
									<div class="swiper-button-prev"></div>
								</div>
							</div>
							<div class="detailsGP"><span>s6213w-y</span></div>
							<ul class="news-listG">
								<li><span>海思3518E方案，多码流技术，百万高清</span></li>
							</ul>
						</li>
						<li class="clear_fix">
							<div class="violet-box">
								<img src="img/information.png" />
								<p>品牌介绍</p>
								<p>INFORMATION</p>
								<i class="squareV"></i>
							</div>
							<div class="detailsV"><img src="img/information-product.jpg" /></div>
							<div class="detailsVB"><img src="img/bg_a.png" /></div>
							<ul class="news-listV">
								<li><span>"siepem"品牌是广州市TK科技有限公司推出的自有品牌</span></li>

							</ul>
						</li>
					</ul>

				</div>
				<div class="title">
					<div class="title-inner">
						<p>关于我们</p>
						<div class="inner">
							<p>STORE DISPLAY</p>
							<div class="line"></div>
						</div>
					</div>
				</div>
				<div class="about">
					<p>广州市TK科技有限公司是领先的监控产品供应商和解决方案服务商，面向全球提供领先的网络视频监控系列产品及专业的行业解决方案。<br/>TK公司自创立以来, 一直持续加大研发投入和不断致力于技术创新。现拥一批技术尖端的研发团队，创造安防行业众多高品质、高性价比的精品持续为客户创造最大价值。 </p>
					<img src="img/lunbotu_03.png" /> 
				</div>
				<div class="title">
					<div class="title-inner">
						<p>联系我们</p>
						<div class="inner">
							<p>STORE DISPLAY</p>
							<div class="line"></div>
						</div>
					</div>
				</div>
				<div class="contact clear_fix">
					<div>
						<div>
							<img src="img/code.jpg" />
							<p>微信扫一扫<br/>关注我们相关的信息</p>
						</div>
						<div>
							<ul>
								<li><img src="img/icon1.png"/>400-000-0000</li>
								<li><img src="img/icon2.png"/> 系  人：某先生</li>
								<li><img src="img/icon3.png"/>www.tk.com</li>
								<li><img src="img/icon4.png"/>000-12345678</li>
								<li><img src="img/icon5.png"/>邮政编码：467000</li>
								<li><img src="img/icon6.png"/>公司地址：广州市某某区某某路某号</li>
							</ul>
						</div>
					</div>
					<div class="information">
						<p>昵称</p>
						<input type="text" />
						<p>联系电话</p>
						<input type="text" />
						<p>电子邮箱</p>
						<input type="text" />
						<p>内容</p>
						<textarea></textarea>
						<div>
							<input type="button" value="提交" />
						</div>
					</div>
					<div class="map">
						<img src="img/map.jpg" />
					</div>
				</div>
				
				
			</section>

			<footer>
				<div>
					<p>关注我们：<img src="img/weibo.png" /><img src="img/qq.png" /><img src="img/weixin.png"></p>

					<ul class="clear_fix">
						<li>
							<a href="">网站首页</a>
						</li>
						<li>
							<a href="">新闻动态</a>
						</li>
						<li>
							<a href="">关于我们</a>
						</li>
						<li>
							<a href="">团队风采</a>
						</li>
						<li>
							<a href="">联系我们</a>
						</li>
						<li>
							<a href="">在线留言</a>
						</li>
					</ul>

				</div>
				<div>
					<p> ©2015 TK科技有限公司 版权所有沪ICP证13022560号-7 All Rights Reserved</p>
				</div>
			</footer>
		</div>
		<script type="text/javascript" src="js/swiper-4.3.3.min.js"></script>
		<script>
			var mySwiper = new Swiper('.swiper-container', {
					autoplay: true,
					pagination: {
						el: '.swiper-pagination',
					},
					navigation: {
						nextEl: '.swiper-button-next',
						prevEl: '.swiper-button-prev',
					},
				})
				//鼠标滑过pagination控制swiper切换
			for(i = 0; i < mySwiper.pagination.bullets.length; i++) {
				mySwiper.pagination.bullets[i].index = i
				mySwiper.pagination.bullets[i].onmouseover = function() {
					mySwiper.slideTo(this.index);
				};
			}
		</script>
	</body>

</html>